<template>
    <div id="app">
        <hr style="border: none"/>
        <search-bar v-on:selectProCallBack="searchProfession"></search-bar>
        <div style="height:100rem">
            <el-row>
                <el-col :span="24">
                    <el-collapse accordion v-model="activeName">       
                        <el-collapse-item  name="1">
                            <template slot="title">
                              2014级{{professionName}}招生就业情况|应招50人|报到49人|毕业年份2018年
                            </template>
                           <first-year></first-year>
                        </el-collapse-item>
                        <el-collapse-item name="2">
                            <template slot="title">
                              2015级{{professionName}}招生就业情况|应招50人|报到49人|毕业年份2018年
                            </template>
                            <second-year></second-year>
                        </el-collapse-item>
                        <el-collapse-item  name="3">
                            <template slot="title">
                              2016级{{professionName}}招生就业情况|应招50人|报到49人|毕业年份2018年
                            </template>
                            <third-year></third-year>
                        </el-collapse-item>
                        <el-collapse-item  name="4">
                            <template slot="title">
                              2017级{{professionName}}招生就业情况|应招50人|报到49人|毕业年份2018年
                            </template>
                           <fourth-year></fourth-year>
                        </el-collapse-item>
                    </el-collapse>
                </el-col>
            </el-row>
        </div>
    </div>
</template>
<script>
import searchBar from "./searchBar";
import firstYear from "./firstYear";
import secondYear from "./secondYear";
import thirdYear from "./thirdYear";
import fourthYear from "./fourthYear";
export default {
  name: "profession",
  components: {
    searchBar,
    firstYear,
    secondYear,
    thirdYear,
    fourthYear
  },
  data() {
    return {
      activeName: "1",
      queryForm: {
        dialogFormVisible: false, //不允许弹出对话框
        data: {
          professionCode: ""
        }
      },
      professionName: ""
    };
  },
  methods: {
    searchProfession:function(profession){
        this.professionName = profession.majorName;
    }
  }
};
</script>
<style>
.el-col {
  height: 100%;
}
.el-collapse-item__header {
  font-size: 1.125rem;
}
</style>

